<template>
  <div class="order_catchjd">
    <!-- <div class="where" style="background: #fff; padding: 10px 30px; font-size: 14px; color: #595959;">当前位置：生产管理>抓单管理>京东抓单</div>
    <div style="height: 16px; width: 100%; background: #F9F9F9;"></div> -->

    <div class="team">
      <div class="powertop">
        <top></top>
      </div>
      <div class="centerall">
        <div class="t-img" style="background:#2974FF;">
          <!-- <img src="../../../static/img/catchjd.png"> -->
          <img src="../../../static/kuanping/jingd.png" style="height: 40px; padding: 20px 40px;">
          <span class="t-email" @click="mobileshow">设置短信报警</span>
          <span class="t-email" style="right: 160px;" @click="biaoqishezhi">订单标旗设置</span>
          <span class="t-email" style="right: 300px;" @click="tongbukai">同步备注配置</span>
        </div>
        <div class="t-con" v-loading="loading">

          <el-table :data="list" border  style="width: 100%">
              <el-table-column  prop="shop_name"   label="店铺名称"  align="center"> </el-table-column>

              <el-table-column label="京东ID"  align="center">
                <template slot-scope="scope">
                  <div style="display: flex;justify-content: center;">
                    <div>{{scope.row.shop_nick}}</div>
                    <div class="cookiechange" @click="showlogjd(scope.row)"><i class="el-icon-edit" style="color: #409eff;"></i></div>
                  </div>
                </template>
              </el-table-column>

              <el-table-column label="京东回调地址"  align="center">
                <template slot-scope="scope">
                  <div style="display: flex;justify-content: center;">
                    <div>{{scope.row.notify_url}}</div>
                    <div class="cookiechange" @click="showlogjd2(scope.row)"><i class="el-icon-edit" style="color: #409eff;"></i></div>
                  </div>
                </template>
              </el-table-column>

              <el-table-column label="下单前置效验"  align="center">
                <template slot-scope="scope">
                  <el-button type="text" @click="peizhi(scope.row)">配置</el-button>
                </template>
              </el-table-column>

<!--              <el-table-column label="检查年龄"    align="center" width="260">
                <template slot-scope="scope">
                  <el-switch v-model="scope.row.age_check" active-color="rgb(8, 201, 160)" inactive-color="rgb(220, 220, 220)" :active-value='1' :inactive-value='0' @change="change_is_delivery(scope.row)"></el-switch>
                </template>
              </el-table-column> -->

              <el-table-column label="cookie状态"  align="center">
                <template slot-scope="scope">
                  <div style="display: flex;justify-content: center;">
                    <div>{{scope.row.stat}}</div>
                    <div class="cookiechange" @click="showlog(scope.row.id)"><i class="el-icon-edit" style="color: #409eff;"></i></div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column  prop="shop_name"  label="自动发货"   align="center">
                <template slot-scope="scope">
                  <el-switch v-model="scope.row.is_delivery" active-color="rgb(8, 201, 160)" inactive-color="rgb(220, 220, 220)" :active-value='1'
                    :inactive-value='0' @change="change_is_delivery(scope.row)"></el-switch>
                </template>
              </el-table-column>
              <el-table-column  prop="shop_name"  label="同步备注"   align="center">
                  <template slot-scope="scope">
                    <el-switch v-model="scope.row.is_remark" active-color="rgb(8, 201, 160)" inactive-color="rgb(220, 220, 220)" :active-value='1'
                      :inactive-value='0' @change="change_is_delivery(scope.row)"></el-switch>
                  </template>
              </el-table-column>
              <el-table-column label="自动退款" align="center" width="200">
                <template slot-scope="scope">

                  <div v-if="scope.row.is_refund == ''">未开启</div>
                  <div v-if="scope.row.is_refund.includes(1) && !scope.row.is_refund.includes(2)">生产失败后立即退款</div>
                  <div v-if="scope.row.is_refund.includes(2) && !scope.row.is_refund.includes(1)">订单进入48小时后敢探号未发货自动退款</div>
                  <div v-if="scope.row.is_refund.includes(1) && scope.row.is_refund.includes(2)">生产失败后立即退款,订单进入48小时后敢探号未发货自动退款</div>

                  <div v-if="scope.row.is_refund.includes(4)">订单终止立即退款</div>

                  <el-button v-if="scope.row.is_refund == ''" type="text" size="mini" @click="tuikuanchuli(scope.row)">开启</el-button>

                  <el-button v-if="scope.row.is_refund != ''" type="text" size="mini" @click="tuikuanchuli2(scope.row)">关闭</el-button>
                  <el-button v-if="scope.row.is_refund != ''" type="text" size="mini" @click="tuikuanchuli(scope.row)">修改</el-button>
                </template>
              </el-table-column>
              <el-table-column  prop="shop_name" width="400" label="操作"  align="center">
                  <template slot-scope="scope">
                    <div style="display: flex; justify-content: center;margin-bottom: 10px; font-size: 14px;">
                      <div><span style="margin-right: 10px;" v-if="scope.row.is_run == 1 && scope.row.is_login == 1">抓单已开启</span></div>
                      <div>
                        <el-button style="margin-right: 10px;" v-if="scope.row.is_run == 0 && scope.row.is_login != 1" type="primary" size="small" round plain @click="gocatch(scope.row.id)">开启抓单</el-button>
                      </div>
                      <div>
                        <el-button type="primary" plain round size="small" @click="loudanchoose(scope.row.id)">漏单补抓</el-button>
                      </div>
                      <div>
                        <el-button type="text" size="small"
                          @click="seelogs(scope.row.id,scope.row.shop_name)">查看抓单失败记录</el-button>
                      </div>
                      <div class="kflexcc">
                        <i class="el-icon-delete" style="color: #2974FF; font-size: 18px; font-weight: bold;" @click="shanchu(scope.row.id)"></i>
                      </div>
                    </div>

                  </template>
              </el-table-column>

          </el-table>


          <!-- <div class="list" style="margin-bottom: 10px;">
            <div class="th">店铺名称</div>
            <div class="th">抓单时间</div>
            <div class="th">cookie状态</div>
            <div class="th">自动发货</div>
            <div class="th">同步备注</div>
            <div class="th td3">操作</div>
          </div>
          <div class="list" v-for="item in list" :key="item.id">
            <div class="td td2">{{item.shop_name}}</div>
            <div class="td">
              <div>开始时间：{{item.fetch_start_at}}</div>
              <div>结束时间：{{item.fetch_end_at}}</div>
            </div>
            <div class="td td2">{{item.stat}}
              <div class="cookiechange" @click="showlog(item.id)"><i class="el-icon-edit" style="color: #409eff;"></i>
              </div>
            </div>
            <div class="td" style="display: flex;justify-content: center; align-items: center;">
              <el-switch v-model="item.is_delivery" active-color="#13ce66" inactive-color="rgb(220, 220, 220)" :active-value='1'
                :inactive-value='0' @change="change_is_delivery(item)"></el-switch>
            </div>
            <div class="td" style="display: flex;justify-content: center; align-items: center;">
              <el-switch v-model="item.is_remark" active-color="#13ce66" inactive-color="rgb(220, 220, 220)" :active-value='1'
                :inactive-value='0' @change="change_is_delivery(item)"></el-switch>
            </div>
            <div class="td3 td td2" style="display: block;">
              <div style="display: flex; justify-content: center;">
                <div><span style="margin-right: 10px;" v-if="item.is_run == 1 && item.is_login == 1">抓单已开启</span></div>
                <div>
                  <el-button v-if="item.is_run == 0 && item.is_login != 1" type="primary" size="mini"
                    @click="gocatch(item.id)">开启抓单</el-button>
                </div>
                <div>
                  <el-button type="primary" plain size="mini" @click="loudanchoose(item.id)">漏单补抓</el-button>
                </div>
              </div>
              <div style="display: flex; justify-content: center;">
                <div>
                  <el-button type="text" size="mini" style="margin-right: 10px;"
                    @click="seelogs(item.id,item.shop_name)">查看抓单失败记录</el-button>
                </div>
                <div>
                  <el-button type="danger" plain size="mini" @click="shanchu(item.id)">删除</el-button>
                </div>
              </div>
            </div>
          </div> -->
          <div class="addshop">
            <el-button type="danger" round @click="addshplog = true"><i class="el-icon-plus"></i>申请添加店铺
            </el-button>
          </div>
          <div class="getcookie">
            <div style="color: #ff253f;">cookie说明：cookie影响抓单、发货和备注同步，请保持可用状态</div>
            <h3>cookie的获取方法：</h3>
            <div>1、登录京东店铺商家后台</div>
            <div>2、左侧菜单点击“订单查询与跟踪”，进入页面</div>
            <div>3、按下F12（或者在设置菜单）中进入开发者模式，点击右上角开发者模式的“network”（部分浏览器在底部显示）。</div>
            <div v-if="!hide" style="margin: 10px 0;">
              <el-button @click="hide = true" type="text" >查看详细教程
              </el-button>
            </div>
            <!-- <div v-if="hide">
              <el-button @click="hide = false" type="text" >查看详细教程
              </el-button>
            </div> -->
            <div v-if="hide">
              <div>4、</div>
              <div><img src="../../../static/img/jd4.png" style="width: 100%;" /></div>
              <!-- <div><img src="../../../static/img/jd1.png" /></div>
              <div>5、点击查询订单按钮，无需设置条件，可以看到开发者窗口中network中的内容开始变化。</div>
              <div><img src="../../../static/img/jd2.png" /></div>
              <div>6、在开发者窗口点击选中name框内的第一个文件，在右侧的headers框内下拉找到cookie，复制冒号后面的内容到 referer上面为止（图示：</div>
              <div><img src="../../../static/img/jd3.png" /></div> -->
              <div>5、粘贴内容到cookie框</div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <el-dialog title="cookie登录" center :visible.sync="log" :close-on-click-modal="false" width="600px">
      <div>
        <el-input type="textarea" placeholder="请输入cookie" v-model="cookies" rows="15"></el-input>
        <!-- :picker-options="timerule" -->
        <div style="margin-top: 20px;">抓单开始时间：<el-date-picker v-model="time" value-format="yyyy-MM-dd HH:mm:ss"
            type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
            placeholder="选择日期时间"></el-date-picker>
        </div>
        <div class="autotidan">
          <div class="xin"><span class="xins">新</span></div>
          <div class="check"><input type="checkbox" v-model="autotidan" />暂停订单自动信息审核通过</div>
          <div class="see">
            <el-tooltip placement="top">
              <div slot="content">勾选后将自动审核“京东订单查询页的暂停订单”（该功能需要运行抓单）</div>
              <div>查看说明</div>
            </el-tooltip>
          </div>
        </div>
        <div class="autotidan" style="line-height: 36px;">
          <div class="xin"><span class="xins">新</span></div>
          <div class="check">抓单后更改旗帜颜色</div>
          <div class="see">
            <el-select v-model="flag" clearable placeholder="选择颜色">
              <el-option label="灰" value="0">
                <span style="float: left">
                  <div class="color1"></div>
                </span>
                <span class="color1s">灰</span>
              </el-option>
              <el-option label="红" value="1">
                <span style="float: left">
                  <div class="color2"></div>
                </span>
                <span class="color2s">红</span>
              </el-option>
              <el-option label="黄" value="2">
                <span style="float: left">
                  <div class="color3"></div>
                </span>
                <span class="color3s">黄</span>
              </el-option>
              <el-option label="绿" value="3">
                <span style="float: left">
                  <div class="color4"></div>
                </span>
                <span class="color4s">绿</span>
              </el-option>
              <el-option label="蓝" value="4">
                <span style="float: left">
                  <div class="color5"></div>
                </span>
                <span class="color5s">蓝</span>
              </el-option>
              <el-option label="紫" value="5">
                <span style="float: left">
                  <div class="color6"></div>
                </span>
                <span class="color6s">紫</span>
              </el-option>
            </el-select>
            </el-form-item>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="info" round @click="log = false">取 消</el-button>
        <el-button type="danger" round @click="gocookie">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="手机号设置" center :visible.sync="mlog" :close-on-click-modal="false" width="600px">
      <div>
        <el-input v-model="mobile" placeholder="请输入手机号"></el-input>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="info" round @click="mlog = false">取 消</el-button>
        <el-button type="danger" round @click="gomobile">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="申请添加店铺" center :visible.sync="addshplog" :close-on-click-modal="false" width="600px">
      <div>
        <el-input v-model="addshopname" placeholder="请输入店铺名"></el-input>
      </div>
      <div style="margin-top:20px; color:#999;">
        注：成功提交后我们将在工作日内48小时配置好，届时可操作抓单。
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="danger" round @click="addshaopf">提交申请</el-button>
      </span>
    </el-dialog>
    <el-dialog title="漏单补抓" center :visible.sync="loudanlog" :close-on-click-modal="false" @close="clearText" width="600px">
      <div style="color: #ff253f;">注：补抓单号之间，请使用英文逗号分隔</div>
      <div>
        <el-input type="textarea" placeholder="请输入补抓单号用','分隔" v-model="loudannum" rows="15"></el-input>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="info" round @click="loudanlog = false">取 消</el-button>
        <el-button type="danger" round @click="loudan">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="设置京东ID" center :visible.sync="logjd" :close-on-click-modal="false" width="600px">
      <div>
        <el-input v-model="shop_nick" placeholder="京东ID"></el-input>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="info" round @click="logjd = false">取 消</el-button>
        <el-button type="danger" round @click="jdijgo">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="设置京东回调地址" center :visible.sync="logjd2" :close-on-click-modal="false" width="600px">
      <div>
        <el-input v-model="notify_url" placeholder="京东回调地址"></el-input>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="info" round @click="logjd2 = false">取 消</el-button>
        <el-button type="danger" round @click="jdijgo2">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="自动退款设置" center :visible.sync="tuikuanlog" :close-on-click-modal="false" width="800px">
      <div>
        <!-- <el-radio v-model="tuikuanall.is_refund" label="1">生产失败后立即退款</el-radio>
        <el-radio v-model="tuikuanall.is_refund" label="2">订单进入48小时后未发货自动退款</el-radio>
        <el-radio v-model="tuikuanall.is_refund" label="3">两种模式都开</el-radio> -->

        <el-checkbox-group v-model="tuikuanall.is_refund" @change="test">
            <el-checkbox :label="1" >生产失败后立即退款</el-checkbox>
            <el-checkbox :label="2" >订单进入48小时后未发货自动退款</el-checkbox>
            <el-checkbox :label="4" >订单终止立即退款</el-checkbox>
        </el-checkbox-group>
      </div>

      <span slot="footer" class="dialog-footer">
        <el-button type="info" round @click="tuikuanlog = false">取 消</el-button>
        <el-button type="danger" round @click="tuikuankaiqi">确 定</el-button>
      </span>
    </el-dialog>

    <biaoqi ref="biaoqi" :source="'jd'"></biaoqi>

    <el-dialog title="下单前置效验" center :visible.sync="logpeizhi" :close-on-click-modal="false" width="800px">

      <div>
        <div style="margin-bottom: 10px;"><el-checkbox v-model="peizhiall.age_check" :true-label="1" :false-label="0">年龄效验</el-checkbox></div>
        <div style="color: rgb(175, 175, 175);margin-bottom: 20px;">检测数据依据：产品设置——年龄限制，开启作用：不符合该年龄区域的用户无法下单</div>
        <div style="margin-bottom: 10px;"><el-checkbox v-model="peizhiall.guangdian_check" :true-label="1" :false-label="0">广电订单效验</el-checkbox></div>
        <div style="color: rgb(175, 175, 175); margin-bottom: 20px;">检测数据来源：产品设置——运营商——中国广电，开启作用：订单会进入广电效验接口效验，效验不通过用户无法下单</div>
      </div>

      <span slot="footer" class="dialog-footer">
        <el-button type="info" round @click="logpeizhi = false">取 消</el-button>
        <el-button type="danger" round @click="peizhigo">确 定</el-button>
      </span>
    </el-dialog>

    <tongbubeizhupeizhi ref="tongbubeizhupeizhi" @guanbi="guanbi" :id="'jd'"></tongbubeizhupeizhi>
  </div>

</template>

<script>
  import axios from 'axios'
  import biaoqi from '@/components/productionManagement/biaoqi'
  import top from '@/components/productionManagement/Azujian/nav.vue'
  import tongbubeizhupeizhi from './log/tongbubeizhupeizhi.vue'
  export default {
    name: "order_catchjd",
    components: {
      biaoqi,
      top,tongbubeizhupeizhi
    },
    data() {
      return {
        flag: "",
        loudanlog: false,
        loudannum: "",
        chooseid: "",
        autotidan: false,
        loading: true,
        list: "",
        hide: false,
        log: false,
        logjd:false,
        cookies: "",
        mobile: "",
        mlog: false,
        addshplog: false,
        addshopname: "",
        id: "",
        time: [],
        // timerule:{
        //     disabledDate(time) {
        //         var time1 = Date.now() - 3600 * 1000 * 24 * 4
        //         return time.getTime() < time1
        //     },
        // },
        mobileid: "",
        shop: "",
        shop_nick:"",
        logjd2:false,
        notify_url:"",

        tuikuanlog:false,
        tuikuanall:{
          id:"",
          is_refund:0
        },
        logpeizhi:false,
        peizhiall:{
          id:"",
          age_check:0,
          guangdian_check:0
        },

      }
    },
    created() {
      this.getlist();
      this.shop = JSON.parse(localStorage.getItem('SHOP')).shop_id
    },
    mounted() {

    },
    methods: {
      tongbukai:function(){
        this.$refs.tongbubeizhupeizhi.chushihua()
      },
      guanbi:function(){

      },
      peizhi:function(item){
        this.peizhiall = {
          id:item.id,
          age_check:item.age_check,
          guangdian_check:item.guangdian_check
        }
        this.logpeizhi = true
      },
      peizhigo:function(){
          axios.post('/api/plan-market/shop/data/syn/set', this.peizhiall)
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message.success('操作成功');
              this.getlist()
              this.logpeizhi = false
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      tuikuankaiqi:function(){
        axios.post('/api/plan-market/shop/data/syn/set', this.tuikuanall)
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message.success('操作成功');
              this.getlist()
              this.tuikuanlog = false
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      tuikuanchuli:function(item){
        this.tuikuanall = {
          id:item.id,
          is_refund:item.is_refund
        }
        this.tuikuanlog = true
      },
      tuikuanchuli2:function(item){
        this.tuikuanall = {
          id:item.id,
          is_refund:[]
        }
        axios.post('/api/plan-market/shop/data/syn/set', this.tuikuanall)
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message.success('操作成功');
              this.getlist()
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      change_is_delivery: function(item) {
        axios.post('/api/plan-market/shop/data/syn/set', {
            id: item.id,
            is_delivery: item.is_delivery,
            is_remark: item.is_remark,
            age_check: item.age_check,
          })
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message.success('操作成功');
              this.getlist()
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },

      biaoqishezhi: function() {
        this.$refs.biaoqi.biaoqi_log = true
      },
      shanchu: function(id) {
        this.$confirm('删除店铺会使已有订单失去订单来源，请慎重删除', '重要', {
          confirmButtonText: '确定删除',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.loading = true
          axios.post('/api/plan-market/out-store/delete', {
              id: id
            })
            .then(response => {
              if (response.data.msg.code == 0) {
                this.getlist()
              } else {
                this.$message.error(response.data.msg.info);
              }
            })
        })

      },
      clearText() {
        this.loudannum = ''
      },
      seelogs(id, name) {
        this.$router.push({
          path: "/order_catch/order_catchjdlogs",
          query: {
            id: id,
            name: encodeURIComponent(name)
          }
        });
      },
      loudanchoose: function(e) {
        this.chooseid = e
        this.loudanlog = true
      },
      loudan: function() {
        var that = this
        var list = [this.loudannum]
        if (this.loudannum.indexOf('，') > -1) {
          list = this.loudannum.split('，')
        }
        if (this.loudannum.indexOf(',') > -1) {
          list = this.loudannum.split(',')
        }
        axios.post('/api/plan-market/out-store/order/refetch', {
            id: this.chooseid,
            orders: list
          })
          .then(response => {
            if (response.data.msg.code == 0) {
              that.$message({
                message: '抓单已提交，请稍后查看。',
                type: 'success'
              });
              that.clearText()
              that.loudanlog = false
            } else {
              that.$message.error(response.data.msg.info);
            }
          })
      },
      //申请店铺
      addshaopf: function() {
        this.addshopname = this.addshopname.trim()
        if (!this.addshopname) {
          this.$message.error('请填写店铺名')
          return
        }
        var that = this
        axios.post('/api/plan-market/out-store/add', {
            name: this.addshopname,
            source: "jd"
          })
          .then(response => {
            if (response.data.msg.code == 0) {
              that.$message({
                message: '申请已发送，我们将在48小时内处理。',
                type: 'success'
              });
              that.addshplog = false
              that.addshopname = ""
            } else {
              that.$message.error(response.data.msg.info);
            }
          })
      },
      mobileshow: function() {
        var that = this
        axios.get('/api/plan-market/out-store/one?id=' + this.mobileid)
          .then(response => {
            if (response.data.msg.code == 0) {
              that.mobile = response.data.data.mobile
              that.mlog = true
            } else {
              that.$message.error(response.data.msg.info);
            }
          })
      },
      stop: function(id) {
        var that = this
        axios.post('/api/plan-market/out-store/stop/fetch', {
            id: id
          })
          .then(response => {
            if (response.data.msg.code == 0) {
              that.$message.success('已停止抓单！');
              that.loading = true
              that.getlist()
            } else {
              that.$message.error(response.data.msg.info);
            }
          })
      },

      jdijgo2:function(){
        axios.post('/api/plan-market/out-store/update', {
            notify_url: this.notify_url.trim(),
            id: this.id
          })
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message({
                message: '设置成功',
                type: 'success'
              });
              this.logjd2 = false
              this.getlist()
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      showlogjd2:function(item){
        this.id = item.id
        if(this.notify_url){
          this.notify_url = item.notify_url
        }else{
          this.notify_url = ''
        }

        this.logjd2 = true
      },
      jdijgo:function(){
        axios.post('/api/plan-market/out-store/update', {
            shop_nick: this.shop_nick,
            id: this.id
          })
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message({
                message: '设置成功',
                type: 'success'
              });
              this.logjd = false
              this.getlist()
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      showlogjd:function(item){
        this.id = item.id
        if(this.shop_nick){
          this.shop_nick = item.shop_nick
        }else{
          this.shop_nick = ''
        }

        this.logjd = true
      },
      //点击登录和重复登录
      showlog: function(id) {
        this.id = id
        this.log = true
        var that = this
        axios.get('/api/plan-market/out-store/one?id=' + id)
          .then(response => {
            if (response.data.msg.code == 0) {
              that.cookies = response.data.data.cookie
              that.time = [response.data.data.fetch_start_at, response.data.data.fetch_end_at]
              // that.autotidan = response.data.data.autotidan
            } else {
              that.$message.error(response.data.msg.info);
            }
          })
      },
      //设置手机号
      gomobile: function() {
        var that = this
        axios.post('/api/plan-market/out-store/update', {
            source: 'jd',
            mobile: this.mobile
          })
          .then(response => {
            if (response.data.msg.code == 0) {
              that.$message({
                message: '手机号设置成功',
                type: 'success'
              });
              that.mlog = false
            } else {
              that.$message.error(response.data.msg.info);
            }
          })
      },
      //开启抓单
      gocatch(id) {
        this.id = id
        axios.post('/api/plan-market/out-store/updaterun', {
            id: this.id
          })
          .then(response => {
            if (response.data.msg.code == 0) {
              this.loading = true
              this.getlist()
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      //cookie登录
      gocookie: function() {
        this.cookies = this.cookies.trim()
        if (this.cookies == "") {
          this.$message('请填写cookie！');
          return false
        }
        if (this.time == "" || this.time == undefined) {
          this.$message('请选择抓单时间！');
          return false
        }
        var that = this
        if (this.autotidan == false) {
          this.autotidan = 0
        } else {
          this.autotidan = 1
        }
        axios.post('/api/plan-market/out-store/update', {
            id: this.id,
            cookie: this.cookies,
            fetch_start_at: this.time[0],
            fetch_end_at: this.time[1],
            is_check_id_card: this.autotidan,
            color: this.flag
          })
          .then(response => {
            if (response.data.msg.code == 0) {
              that.loading = true
              that.log = false
              that.getlist()
            } else {
              that.$message.error(response.data.msg.info);
            }
          })

      },
      //获取号码
      getlist: function() {
        var that = this
        axios.get('/api/gth/out-store/list?source=jd')
          .then(response => {
            if (response.data.msg.code == 0) {
              if (response.data.data != '') {
                for (var i in response.data.data) {
                  if (response.data.data[i].is_cookie === 0) {
                    response.data.data[i].stat = "不可用，请重新录入";
                  }
                  if (response.data.data[i].is_cookie === 1) {
                    response.data.data[i].stat = "可用";
                  }
                  // if(response.data.data[i].cookie != "" && response.data.data[i].is_run == 0 && response.data.data[i].is_login == 2){
                  // 	response.data.data[i].stat = "已暂停抓单";
                  // }
                  // if(response.data.data[i].cookie != "" && response.data.data[i].is_run == 0 && response.data.data[i].is_login != 2){
                  // 	response.data.data[i].stat = "cookie已失效，请重新输入开始抓单"
                  // }
                  // if(response.data.data[i].cookie == "" && response.data.data[i].is_run == 0){ response.data.data[i].stat = "未抓单"}
                  // if(response.data.data[i].cookie != "" && response.data.data[i].is_run == 1){
                  // 	response.data.data[i].stat = "正在努力抓单中..."
                  // }
                }
                that.list = response.data.data
                that.mobileid = response.data.data[0].id
                that.loading = false
              } else {
                that.loading = false
              }

            } else {
              that.$message.error(response.data.msg.info);
            }

          })
      },
      //翻页
      fanye: function(page) {
        this.loading = true
        this.getlist()
      }
    },
  }
</script>

<style lang="scss" scoped>
  .order_catchjd {
    @keyframes hua {
      0% {
        padding-left: 0px
      }

      100% {
        padding-left: 30px
      }
    }
    /deep/ .el-button--danger {
        color: #FFF;
        background-color: #2974FF;
        border-color: #2974FF;
    }
    /deep/ .el-button--danger.is-plain {
        color: #EEF7FF !important;
        background: #EEF7FF !important;
        border-color: #18A0FB !important;
    }

    /deep/ .el-table th{ background: #F9F9F9;}

    .autotidan {
      display: flex;
      margin-top: 20px;

      .xin {
        flex-basis: 50px;

        .xins {
          color: #DD2727;
          animation: hua 2s infinite;
        }
      }

      .check {
        flex-basis: 200px
      }

      .see {
        flex-basis: 100px;
        color: #409EFF;
        cursor: pointer;
      }
    }

    .team {
      background: #F9F9F9;

      .powertop {
        display: flex;
        width: 640px;
      }

      .powertopli {
        flex-basis: 160px;
        line-height: 45px;
        border-top: 4px #F9F9F9 solid;
        color: #727272;
        font-size: 14px;
        text-align: center;
      }

      .powertopact {
        background: #FFFFFF;
        border-top: 4px #DD2727 solid;
      }

      .centerall {
        padding: 20px;
        background: #FFFFFF;
        color: #666;

        .t-img {
          margin-bottom: 20px;
          position: relative;


          .t-email {
            position: absolute;
            background: #FFFFFF;
            color: #DD2727;
            right: 20px;
            padding: 8.5px 15px;
            border-radius:20px;
            top: 23px;
            margin-right: 10px;
            cursor: pointer;
          }
        }

        .t-con {
          .list {
            display: flex;
            text-align: center;
            color: #727272;
            line-height: 45px;
            border-top: 1px #EAEAEA solid;
            border-bottom: 1px #EAEAEA solid;
            margin-top: -1px;

            .th {
              flex: 1;
              background: #F9F9F9;
              font-size: 14px;
              border-right: 1px #EAEAEA solid;
            }

            .td {
              flex: 1;
              font-size: 14px;
              border-right: 1px #EAEAEA solid;
            }

            .td2 {
              display: flex;
              justify-content: center;
              align-items: center;
              flex-wrap: wrap;
            }

            .el-button--danger {
              padding: 7px 15px !important;
            }

            .td3 {
              flex: 1.5;
            }
          }

          .el-pagination {
            text-align: right;
            margin: 20px 0
          }

          .addshop {
            text-align: center;
            padding: 20px 0;
          }
        }

        .getcookie {
          background: rgb(238, 247, 255);
          padding: 20px;
          line-height: 30px;
          margin-top: 40px;
          border: 1px #e6e6e6 solid;
        }
      }
    }

    .cookiechange {
      margin-left: 5px;
      cursor: pointer;
    }

  }
</style>
